import React, { useState } from 'react';
import { HelloComponent } from './components/Hello';
import {NameEditComponent} from './components/nameEdit'

// ts 让我们在写代码的时候就发现问题
// App1是根组件，一般不需要传参，所以不声明类型
export const App1 = () => {
    const [name, setName] = useState('defaultUserName');
    const setUsernameState = (newName:string) => {
        setName(newName)
    }
    
    return (
        <>
            <HelloComponent userName={name} ></HelloComponent>
            <NameEditComponent initialUserName={name}
                onNameUpdated={setUsernameState}></NameEditComponent>
        </>
    )
}


export default App1;